<!DOCTYPE html>
<html>
<head>
<title>navbar version1</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript"
	src="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/test/navbar/js/jquery.js"></script>
<script type="text/javascript"
	src="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/main/bootstrap.js"></script>
<link
	href="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/css/bootstrap.css"
	rel="stylesheet" media="screen">
<link
	href="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/test/navbar/css/test.css"
	rel="stylesheet" media="screen">
<link
	href="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/css/bootstrap-responsive.css"
	rel="stylesheet" media="screen">
<body>
</head>
<div class="navbar  navbar-fixed-top navbar-inverse">
	<div class="navbar-inner">
		<div class="container">
			<a class="btn btn-navbar" data-toggle="collapse"
				data-target=".nav-collapse"> <span class="icon-bar"></span> <span
				class="icon-bar"></span> <span class="icon-bar"></span>
			</a> <a class="brand " href="#">网站</a>
			<div class="nav-collapse collapse">
				<ul class="nav">
					<li class="divider-vertical"></li>
					<li><a href="#">&nbsp;博客&nbsp;</a></li>
					<li class="divider-vertical"></li>
					<li><a href="#music">&nbsp;音乐&nbsp;</a></li>
					<li class="divider-vertical"></li>
					<li><a href="#">&nbsp;电影&nbsp;</a></li>
					<li class="divider-vertical"></li>
					<li><a href="#novel">&nbsp;小说&nbsp;</a></li>
					<li class="divider-vertical"></li>
					<li><a href="#">&nbsp;特效&nbsp;</a></li>
				</ul>
			</div>

		</div>
	</div>
</div>
<!-- 轮训的个人简介 -->
<div class="row-fluid" style=""></div>
<!-- 
			下面是正文
		 -->
<article class="container">

	<!-- 个人博客部分 -->
	<section class="row panel">
		<div class="span8">
				
		</div>
		<div class="span4">
		
		</div>
	</section>
	<!-- 音乐部分 -->
	<hr>
	<section class="row panel" id="music">
				<div class="span6">
					<div class="panel-padding">
						<ul class="nav nav-tabs">
							<li class='active'><a href="#home" data-toggle="tab" class="panel-word-bump">梁静茹</a></li>
							<li><a href="#profile" data-toggle="tab" class="panel-word-bump">五月天</a></li>
							<li><a href="#messages" data-toggle="tab" class="panel-word-bump">周杰伦</a></li>
							<li><a href="#settings" data-toggle="tab" class="panel-word-bump">刘若英</a></li>
						</ul>
						<div class="tab-content">
							<!-- 严格限制5行内容 -->
							<div class="tab-pane active fade in" id="home">
								<p style="text-indent: 40px">梁静茹（Fish Leong），华语著名女歌手。出生于马来西亚，祖籍佛山市顺德区。
									1997年被李宗盛发掘，并独自到台湾发展。1999年发行首张专辑
									进一步基本奠定了她疗伤、温暖情歌的路线。2003年梁静茹凭借《Sunrise,我喜欢
									》获得HITO流行音乐奖-2002年度HITO海外歌手奖、2005年又凭借《燕尾蝶》获得
									数位音乐风云榜-十大风云歌手。她的代表作还包括《可惜不是你》《会呼吸的痛》《情歌》等</p>
							</div>
							<div class="tab-pane fade in " id="profile">
								<p>梁静茹（Fish Leong），华语著名女歌手。出生于马来西亚，祖籍佛山市顺德区。
									1997年被李宗盛发掘，并独自到台湾发展。1999年发行首张专辑
									进一步基本奠定了她疗伤、温暖情歌的路线。2003年梁静茹凭借《Sunrise,我喜欢
									》获得HITO流行音乐奖-2002年度HITO海外歌手奖、2005年又凭借《燕尾蝶》获得
									数位音乐风云榜-十大风云歌手。她的代表作还包括《可惜不是你》《会呼吸的痛》《情歌》等</p>
							</div>
							<div class="tab-pane fade in" id="messages"></div>
							<div class="tab-pane fade in" id="settings"></div>
						</div>
						<div>
							<button class="btn btn-large btn-primary" type="button">Large
								button</button>
						</div>
					</div>
				</div>

				<div class="span6">
					<div id="carousel-music" class="carousel slide m-carousel">
						<ol class="carousel-indicators">
							<li data-target="#carousel-music" data-slide-to="0" class="active"></li>
							<li data-target="#carousel-music" data-slide-to="1"></li>
							<li data-target="#carousel-music" data-slide-to="2"></li>
						</ol>
						<!-- Carousel items -->
						<div class="carousel-inner">
							<div class="active item">
								<img
									src="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/test/navbar/images/carousel-04.jpg"
									class="img-radius-right">
							</div>
							<div class="item">
								<img
									src="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/test/navbar/images/carousel-04.jpg"
									class="img-radius-right">
							</div>
							<div class="item">
								<img
									src="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/test/navbar/images/carousel-04.jpg"
									class="img-radius-right">
							</div>
						</div>
						<!-- Carousel nav -->
						<a class="carousel-control left" href="#carousel-music"
							data-slide="prev">&lsaquo;</a> <a class="carousel-control right"
							href="#carousel-music" data-slide="next">&rsaquo;</a>
					</div>

		</div>
	</section>
	<!-- 电影部分 -->
	<section class="row-fluid ">
		<div class="span6">yujintao</div>
		<div class="span6">yujintao</div>
	</section>
	<!-- 小说部分 -->
	<section class="row panel" id="novel">
		<div class="span8">
		  <div class="panel-padding">	
			<div class="tabbable tabs-left">
			  <ul class="nav nav-tabs ">
			  	<li class="active"><a href="#novel-tab1" data-toggle="tab">Section 1</a></li>
    			<li><a href="#novel-tab2" data-toggle="tab">Section 2</a></li>
			  </ul>
			  <div class="tab-content">
			  	<div class="tab-pane fade in  active " id="novel-tab1">
			      <p>I'm in Section 1.</p>
			      <img class="img-radius-right" src="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/test/navbar/images/carousel-04.jpg"></img>
			    </div>
			    <div class="tab-pane fade in" id="novel-tab2">
			      <p>Howdy, I'm in Section 2.</p>
			    </div>
			  </div>
			</div>
		  </div>
		</div>
		
		
		<div class="span4">
			<div class="novelpic ">
				<img class="img-radius-right"src="http://localhost:8080/JavascriptAPI/bootstrap/2.3.1/test/navbar/images/carousel-04.jpg"></img>
			</div>
		</div>
	</section>
	
	<!-- jquery特效部分 -->
	<section class="row-fluid">
		<div class="span6">yujintao</div>
		<div class="span6">yujintao</div>
	</section>
</article>
</body>

</html>